<!-- 促销计划 -->
<template name='derate'>	
<view >
	<!-- 商品信息-右边 -->
	<view class="box-infod font12" >
		<!-- 增加、删除 -->
		<view class="top-but">
			<view class="top-but-box">
			
				<view @click="addShow('')" class="add_color but-add" >
					<img src="../../static/img/add.png" class="img"></img>
					增加计划
				</view>
				<text selectable="true"  class="tipss">用于商城的满减活动；相对于同单子的减免</text>
				<view @click="$common.noMultipleClicks('getPlanDerate',getPlanDerate,true)" 
				class="rightButttom" >
					<img src="../../static/img/update.png" class="ico"></img>
					刷新
				</view>
			</view>
		</view>
		<!-- 数据列表 -->
		<view class="content-box " >
			<!-- 列表头 -->
			<view class="goods-list-top">
				<view style="width: 5%" class="center border-right">
					序
				</view>
				<view style="width: 30%" class="border-right">
					活动计划
				</view>
				<view style="width: 10%" class="center border-right">
					满足金额
				</view>
				<view style="width: 5%;" class="center border-right">
					减免金额
				</view>
				<view style="width: 20%" class="center border-right">
					备注
				</view>
				<view style="width: 15%;" class="center border-right">
					状态
				</view>
				<view style="width: 10%;" class="center border-right">
					操作者
				</view>
				<view style="width: 5%;" class="center border-right ">
					操作
				</view>
			</view>
			<!-- end -->
			<!-- 列表内容 -->
			<view class="menu-scroll w100">
				<view class="list_detail goods-list " 
				v-for="(item,index) in resData.list" 
				:key="index"
				@click="TabcheckedIndex = index"
				:class="TabcheckedIndex == index ? 'goods-list-select':''"
				>
					<view style="width: 5%" class="center border-right">
						{{index+1}}
					</view>
					<view style="width: 30%" class="justify border-right">
						{{item.nickname}}
					</view>
					<view style="width: 10%;" class="center color-e40318 border-right">
						{{item.money}}
					</view>
					<view style="width: 5%;" class="center color-e40318 border-right">
						{{item.money_derate}}
					</view>
					<view style="width: 20%" class="center border-right">
						{{item.descs}}
					</view>
					<view style="width: 15%;" class="center status0 border-right" v-if="item.status==1 && item.start_time >resData.now_time">
						未到时间
						<!-- 正新、暂停、缺货 -->
					</view>
					<view style="width: 15%;" class="center font12 border-right" v-if="item.status==1 && item.start_time <= resData.now_time">
						<countdown
						style="margin-left: auto;" 
						:startTime="resData.now_time" 
						:endTime="item.end_time" 
						v-if="item.status==1" 
						/>
					</view>
					<view style="width: 15%;" class="center status2 border-right" v-if="item.status==2">
						已停止
						<!-- 正新、暂停、缺货 -->
					</view>
					<view style="width: 15%;" class="center status2 border-right" v-if="item.status==2">
						已停止
						<!-- 正新、暂停、缺货 -->
					</view>
					<view style="width: 10%" class="center border-right">
						{{item.uid_name}}
					</view>
					<view style="width: 5%;" class="center rightBut border-right">
						<view @click="addShow(item)" class="margin">
							详细
						</view>
					</view>
				</view>
			</view>
			<!-- end -->
			
			<!-- 暂无数据 -->
			<empty v-if="resData.list==undefined || resData.list.length==0"></empty>
			<!-- end -->
			<!-- end -->
			<pages 
			:sum="page.sum"
			:current="page.nowPage"
			@updatePage="updatePage"
			></pages>
		</view>
		<!-- 数据列表end -->
		<!-- 增加/修改  遮罩层 -->
		<uni-popup ref="popup" type="center" title="新增满减计划">

			<view class="add-box">
				<view class="add-goods"style="flex:1">
					<view >计划名称</view>
					<input
					v-model="add.data.nickname" 
					class="pop-input" 
					placeholder="温醒提示：此计划名称会在商城展示，可被所有人见到"
					 placeholder-class="placeholder-class"
					/>
				</view>
			</view>
			
			<view class="add-box">
				<view class="add-goods"style="flex:1">
					<view >活动时间</view>
					<view class="input_confirms ">
						<uni-datetime-picker type="daterange" class="date-box color-e40318"
						v-model="add.data.date"
						:clear-icon="false" 
						></uni-datetime-picker>
					</view>
				</view>
			</view>
						
			<view class="add-box">
				<view class="add-goods"style="flex:1">
					<!-- 数据列表 -->
					<view class="content-box font12" >
						
						
						
						<!-- 列表内容 -->
						
							<table >
								<thead>
									<tr >
										<th>序</th>
										<th>商品名称</th>
									</tr>
								</thead>
								<tbody>
									<tr v-for="(item,index) in planGoodsList" 
										:key="index" 
										:class="index==TabcheckedIndex  ? 'goods-list-select':''"
									>
										<td>{{index+1}} </td>
										<td 
										class="bb4e00   hover"
										 @click="pageSend.value=item.id,$refs.pageGoods.open()"
										 >{{item.name}} </td>
										
									</tr>
								</tbody>
							</table>
						
						<!-- end -->
			
						<view >
							<img  src="../../static/img/goodsAdd.png"
							class="marginAuto" 
							@click="openSearchGoods(1)"></img>
							<text selectable="true"  class="tips">增加不参与活动商品</text>
						</view>
					</view>
					<!-- 数据列表end -->
				</view>
			
			</view>
			<view class="add-box">
				<view class="add-goods">
					<view >满足金额</view>
					
					<input 
					v-model="add.data.money" 
					placeholder="输入客户整单货款金额"
					type="number" placeholder-class="placeholder-class"
					class="pop-input" />
				</view>
			</view>
					
			<view class="add-box">
				<view class="add-goods" style="flex:1">
					<view >优惠专用</view>
					
					<view class="pop-input justify" @click="openSearchGoods(2)">
						{{add.data.goods_name_plan}}
					</view>
				</view>
			</view>
			<view class="add-box">
				<view class="add-goods">
					<view class="tips">请先创建一个有图，批发价为1元的优惠专用商品</view>
					
				</view>
			</view>
			<view class="add-box">
				<view class="add-goods">
					<view>减免金额</view>
					
					<input 
					placeholder="输入整单满足金额后的减免金额"
					v-model="add.data.money_derate" 
					type="number" placeholder-class="placeholder-class"
					class="pop-input" />
				</view>
			</view>
					
			<view class="add-box">
				<view class="add-goods"style="flex:1">
					<view >其他备注</view>
					
					<input
					v-model="add.data.descr" 
					class="pop-input" placeholder-class="placeholder-class" />
				</view>
			</view>
			
			<view class="add-box">
				<view class="add-goods"style="flex:1">
					<view >活动状态</view>
					
					<view class="pop-input">
						<uni-data-select
						:localdata="add.planTypeArr"
						v-model="add.data.status"
						placeholder="选择活动的状态"
						placeholder-class="placeholder-class"
						></uni-data-select>
					</view>
				</view>
			</view>
			
			<view class="add-box">
				<view class="add-goods"style="flex:1">
					<view >弹出提示</view>
					<switch @change="change" :checked="add.data.recommend==1" class="switch"/>
				</view>
			</view>
			<view class="add-box" v-if="add.data.recommend==1">
				<view class="add-goods">
					<view class="justify recommendUrl" v-if="add.data.recommendUrl==undefined || add.data.recommendUrl==''" @click="chooseImage()">
						<img  src="../../static/img/add1.png"></img>
					</view>
					<img v-if="add.data.recommendUrl" style="width: 100%;" class="recommendUrl" :src="add.data.recommendUrl" @click="chooseImage()"></img>
				</view>
			</view>
			<!-- $common.baseUrl.host+$common.baseUrl.static+ -->
			<view class="but-box">
				<view class="but-boxs">
					<view @click="$refs.popup.close"  class="add-but-close">
						取 消
					</view>
					<view @click="$common.noMultipleClicks('fun_plan',fun_plan)"  class="add-but-com">
						确定
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- end -->
		<!-- 选择商品 遮罩层 -->
		<uni-popup ref="goods" type="center" title="选择商品">
			<!-- 数据列表 -->
			<view class="content-box font12" >
				<view class="add-box">
					<view class="add-goods">
						<view>搜索商品关键字</view>
						
						<input 
						v-model="add.goodsSearch.value" 
						@confirm="GetgoodsSearch(true)"
						@input="GetgoodsSearch(true)"
						class="pop-input" placeholder-class="placeholder-class" />
					</view>
					<view @click="$common.noMultipleClicks('GetgoodsSearch',GetgoodsSearch,true)"  class="add-but-com">
						<img src="../../static/img/search.png" class="ico"></img>
						搜索
					</view>
				</view>
				<!-- 列表头 -->
				<view class="goods-list-top">
					<checkbox
						border-color="#333333" activeborderColor="#333333" activeBackgroundColor="#333"
						:checked="checkbox.select" 
						@click="choose_all"
						class="border-right"
						style="transform:scale(0.7);width: 5%;"
					/>
					<view style="width: 10%" class="center border-right">
						序
					</view>
					<view style="width: 30%" class="border-right">
						商品
					</view>
					<view style="width: 30%;" class="center border-right">
						库存
					</view>
					<view style="width: 25%;" class="center border-right">
						批发价
					</view>
				</view>
				<!-- end -->
				<!-- 列表内容 -->
				<view class="menu-scroll w100">
					<checkbox-group @change="checkbox_change" class="goods_list-box" >
						<view class="list_detail goods-list " 
						v-for="(item,index) in add.goodsSearch.list" 
						:key="index"
						@click="selectListIndexs(item)"
						>
							<checkbox
								:value="item.id.toString()" 
								border-color="#333333" activeborderColor="#333333" activeBackgroundColor="#333"
								:disabled="item.mp_grounding==1?false:true"
								:checked="checkbox.checkbox_status.includes(item.id)" 
								style="transform:scale(0.7);width: 5%;"
								class="border-right"
							/>
							<view style="width: 10%" class="center border-right">
								{{index+1}}
							</view>
							<view style="width: 30%" class="justify border-right">
								{{item.name}}
							</view>
							<view style="width: 30%;" class="center border-right">
								{{item.margin}}
							</view>
							<view style="width: 25%;" class="center border-right">
								￥{{item.pifajia}}
							</view>
						</view>
					</checkbox-group>
				</view>
				<!-- end -->
			
				<!-- 暂无数据 -->
				<empty v-if="add.goodsSearch.list.length==0"></empty>
				<!-- end -->
				<pages 
				:sum="add.page.sum"
				:current="add.page.nowPage"
				@updatePage="AddUpdatePage"
				></pages>
			
			</view>
			<!-- 数据列表end -->
			
			<view @click="selectListIndex" class="planSelectGoodsBut">
				<img src="../../static/img/search.png" class="ico"></img>
				确定选择
			</view>
		</uni-popup>
		<!-- end -->
		<!-- 商品页面 -->
		<uni-popup ref="pageGoods" type="center" :title="pageSend.value">
			<shopping_admin :isPop="false" :OnPageSearchGoodsId="pageSend.value"  class="h100"></shopping_admin> 
		</uni-popup>
		<!-- end -->
	</view>
</view>


</template>

<script>
	import empty from "@/components/admin-components/empty.vue"

	import pages from "@/components/admin-components/pages.vue"
	import countdown from "@/components/cz-countdown/cz-countdown"
	import shopping_admin from "@/components/goods/goods.vue"
	export default{
		name:'derate',
		components: {
			empty,pages,countdown,shopping_admin
		},
		data(){
			return{
				pageSend:{
					value:''
				},
				TabcheckedIndex:-1,//当前选中项
				resData:{},
				add:{
					goodsSearch:{
						value:'',
						pifajia:'0',
						list :[],
					},
					planTypeArr:[//活动状态
						// {text:'未开始',value:'0'},
						{text:'开启计划',value:'1'},
						{text:'关闭计划',value:'2'},
					],
					update_id:'',//修改计划的id
					seleteGoodsType:1,//1=选择活动商品模式；2=选择赠送商品模式
					data:{//欲要提交的商品
						money:'',//赠送商品
						money_derate:'',//计划商品名称
						start_time:'',//开始时间
						end_time:'',//结束时间
						descr:'',//计划备注
						status:'',//计划状态
						date:'',//计划时间
						nickname:'',//计划名称
						recommend:0,//弹出推荐 0=关闭
						recommendUrl:'',//弹出的图片
						goods_id_plan:'',//赠送商品
						goods_name_plan:'',//计划赠送商品名称
					},
					page:{
						
						nowPage:1,//当前页数
						pageCount:1,//总页数
						maxCount:0,
						sum:0,
						pageCounts:15,
					},
				},
				checkbox:{//多选框
					checkbox_status:[],
					select_all:false,
				},
				planGoodsList:[//活动商品ID、名字的数组
					// {id:'',name:''}
				],
				page:{
					
					nowPage:1,//当前页数
					pageCount:1,//总页数
					maxCount:0,
					sum:0,
					pageCounts:15,
				},
			}
		},
		 // 此处定义传入的数据
		props: {
		},
		mounted(){
		},
		created() {
			this.getPlanDerate(true)
		},
		methods:{

			/**
			 * 全选按钮的操作
			*/
			checkbox_change(e){
				this.checkbox.checkbox_status = e.detail.value
			},
			
			/**
			 * 全选中
			*/
			choose_all(){
				this.checkbox.checkbox_status = []
				if(this.checkbox.select_all == false){
					this.checkbox.select_all = true
					var tmpList = this.add.goodsSearch.list;
					for (var i=0;i<tmpList.length;i++) {
						this.checkbox.checkbox_status.push(tmpList[i].id)
					}
					
				}else{
					this.checkbox.select_all = false
					this.checkbox.checkbox_status = []
				}
			},
			
			// 取消全选中
			choos_all_close(){
				this.checkbox.select_all = false
				this.checkbox.checkbox_status = []
			},
			
			/**
			 * 推荐的弹出-选择图片
			*/
			chooseImage(){
				var that = this
				uni.chooseImage({
					count:1,
					sizeType: ['compressed'], //original 原图，compressed 压缩图，
					success:(e)=>{
						//console.log(e.tempFilePaths[0])
						that.add.data.recommendUrl = e.tempFilePaths[0]
					},
					fail:(res)=>{
						if(res.errMsg){
							uni.showModal({
									title:'错误',
									content:res.errMsg,
									showCancel:false
							});
						}
					}
				})
			},
			
			/**
			 * 推荐的弹出-开关
			*/
			change(res){
				this.add.data.recommend = res.detail.value==false? 0:1;
			},

			timestampToTime(timestamp) {
			  // 时间戳为10位需*1000，时间戳为13位不需乘1000
			  var date = new Date(timestamp * 1000);
			  var Y = date.getFullYear() + "-";
			  var M =
			    (date.getMonth() + 1 < 10
			      ? "0" + (date.getMonth() + 1)
			      : date.getMonth() + 1) + "-";
			  var D = (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
			  
			  return Y + M + D ;
			},
			
			/**
			 * 打开搜索商品窗口
			*/
			openSearchGoods(type){
				if(this.add.update_id!=''){
					this.$common.toast("修改计划的时候不允修改商品，如需修改商品可创建新的计划")
					return
				}
				if(this.add.goodsSearch.list.length==0){
					this.GetgoodsSearch(true)
				}
				this.add.seleteGoodsType = type
				this.$refs.goods.open()
			},

			/**
			 * 打开增加、修改窗口
			 * update_id : 可能为空；即是新增
			*/
			addShow(item){
				let that = this
				that.add.data.restrict = []
				if(item.id && item.id!=""){
					//把需要编辑的内容赋值到弹出窗处
					that.add.update_id = item.id
					that.add.data.date = []
					that.add.data.date.push(that.timestampToTime(item.start_time))
					that.add.data.date.push(that.timestampToTime(item.end_time))
					that.add.data.descr= item.descs
					that.add.data.end_time= ''
					
					
					that.planGoodsList = item.GoodsList
				
					that.add.data.money= item.money
					that.add.data.money_derate= item.money_derate
					
					
					that.add.data.goods_id_plan= item.goods_id_plan
					that.add.data.goods_name_plan= item.plan.name
					
					that.add.data.start_time= ''
					that.add.data.status    = item.status
					that.add.goodsSearch.pifajia = item.pifajia
					that.add.data.restrict  = item.restricts
					
					that.add.data.nickname  = item.nickname
					
					that.add.data.recommend = item.recommend
					//验证再次修改的时候图片有没有被修改，有的话就重新上传图片
					that.add.data.recommendUrlTmp = item.recommendUrl
					that.add.data.recommendUrl = item.recommendUrl
				}else{
					that.add.update_id = ''
					//that.add.data      = {}
					//验证再次修改的时候图片有没有被修改，有的话就重新上传图片
					that.add.data.recommendUrlTmp = ''
					that.add.data.date    = []
					that.add.data.descr   = ''
					that.add.data.end_time= ''
					
					
					that.planGoodsList      = []
					that.add.data.money= ''
					that.add.data.money_derate     = ''
					
					that.add.data.goods_id_plan= ''
					that.add.data.goods_name_plan= ''
					
					that.add.data.start_time= ''
					that.add.data.status= ''
					that.add.goodsSearch.pifajia =  ''
					that.add.data.restrict = ''
					that.add.data.nickname = ''
					that.add.data.recommend = ''
				}
				that.$refs.popup.open()
			},

			/**
			 * 搜索商品 分页器回调
			*/
			AddUpdatePage(pageName,pageCount){
				var that = this
				that.add.page.nowPage = pageName
				that.add.page.pageCounts = pageCount
				that.GetgoodsSearch(false)
			},
			/**
			 * 搜索商品
			*/
			GetgoodsSearch(isUpdatePage=true){
				var that = this

				that.add.page.nowPage = isUpdatePage == true ? 1:that.add.page.nowPage;
				
				that.$common.get_request(
					{
						type:'goods_list',
						search:that.add.goodsSearch.value,//搜索内容
						pages:that.add.page.nowPage,//当前位于页数
						page_count:that.add.page.pageCounts,//当前请求页的数量
					},
					(res)=>{
						that.add.goodsSearch.list = res.list
						that.add.page.pageCount  = res.pageCount
						that.add.page.sum  = res.sum
						if(isUpdatePage == true){
						that.add.page.nowPage  = 1
						}
						that.add.page.maxCount  = res.maxCount
						
						that.choos_all_close()
					}
				);
			},
			/**
			 * 选中商品
			 * type : goods_list|goods_search
			*/
			selectListIndex(){
				var that = this
				if(that.checkbox.checkbox_status.length==0){
					that.$common.toast("未有选中需要的，失败。")
					return
				}
				//id转换名字
				that.$common.get_request(
					{
						type:'goodsIdGetGoodsName',
						data:JSON.stringify(that.checkbox.checkbox_status),
					},
					(res)=>{
						that.planGoodsList = res.list;

						that.$refs.goods.close()
					}
				);
			},
			/**
			 * 选中商品，被赠送的
			*/
			selectListIndexs(item){
				if(item.mp_grounding!=1){
					this.$common.showModal("当前商品未上架小程序无法增加")
					return
				}
				if(this.add.seleteGoodsType==2){
					this.add.data.goods_id_plan = item.id
					this.add.data.goods_name_plan = item.name
					this.$refs.goods.close()
				}
			},
			/**
			 * 分页器回调
			*/
			updatePage(pageName,pageCount){
				var that = this
				that.page.nowPage = pageName
				that.page.pageCounts = pageCount
				that.getPlanDerate(false)
			},
			/**
			 * 读取
			 * 
			*/
			getPlanDerate(isUpdatePage=true){
				var that = this
				that.page.nowPage = isUpdatePage == true ? 1:that.page.nowPage;
				that.$common.get_request(
					{
						type:'getPlanDerate',
						pages:that.page.nowPage,//当前位于页数
						page_count:that.page.pageCounts,//当前请求页的数量
					},
					(res)=>{
						that.resData = res
						
						that.page.sum  = res.sum
						if(isUpdatePage == true){
						that.page.nowPage  = 1
						}
						
					}
				);
			},
			
			/**
			 * 保存、修改方法
			*/
			fun_plan(){
				var that = this
				if(that.add.data.date.length<2){
					that.$common.toast("请选择计划的时间后再试")
					return
				}
				if(that.add.data.goods_id_plan.length==0){
					that.$common.toast("请输入计划 赠送商品 后再试")
					return
				}
				if(that.add.data.money.length==0){
					that.$common.toast("请输入计划 金额 后再试")
					return
				}
				if(that.add.data.money_derate.length==0){
					that.$common.toast("请输入计划 减免 后再试")
					return
				}
			
				if(that.add.data.status.length==0){
					that.$common.toast("请输入计划 状态 后再试")
					return
				}
				if(that.add.data.recommend==1 && that.add.data.recommendUrl==''){
					that.$common.toast("请输入计划 弹出推荐的图片 后再试，反之关闭弹出推荐选项后再试")
					return
				}
				let data       = that.add.data
				data.restricts  = JSON.stringify(data.restrict)
				data.planGoodsList = JSON.stringify(that.planGoodsList)
				data.update_id = that.add.update_id
				data.start_time= that.add.data.date[0]
				data.end_time  = that.add.data.date[1]
				data.type      = that.add.update_id==''?'plan_derate_sva':'plan_derate_update'
				//如果包含了http,就是修改的。
				if (that.add.data.recommend ==0 || that.add.data.recommendUrl== that.add.data.recommendUrlTmp) {  
					
					that.$common.get_request(
						data,
						(res)=>{
							uni.showModal({
								content:res.msg,
								showCancel:false,
								success: () => {
									that.$refs.popup.close()
									that.getPlanDerate(true)
								}
							})
						}
					);
					
				} else {  
					//反之就是新增的需要上传图片
					that.$common.uploadFile(
						that.add.data.recommendUrl,
						data,
						(res)=>{
							uni.showModal({
								content:res.msg,
								showCancel:false,
								success: () => {
									that.$refs.popup.close()
									that.getPlanDerate(true)
								}
							})
						},
					) 
				}

				
			},
			
		}
	}
	
</script>

<style>

	.marginAuto{
		display: flex;
		margin: 20px auto 0px auto;
		width: 30px;
	}
</style>
